<template>
  <div class="filter-card">
    <div class="up">
      <div class="search-item">
        <span class="item-name">型号：</span>
        <el-input v-model="searchObj.model"></el-input>
      </div>

      <div class="search-item">
        <span class="item-name">询价类型：</span>
        <el-select v-model="searchObj.priceType" placeholder="请选择" >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </div>

      <div class="search-item">
        <span class="item-name">询价日期：</span>
        <myDate
          style="width: 250px"
          @getSelectData="getCreateDate"
          :createDate="searchObj.Date"
        />
        <!-- <el-date-picker
          v-model="searchObj.time"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        >
        </el-date-picker> -->
      </div>

      <div class="search-item">
        <el-button class="btn-style" @click="handle('search')">搜索</el-button>
        <el-button class="btn-style" @click="handle('clear')">重置</el-button>
      </div>
    </div>
    <div class="down">
      <el-button class="btn-style" @click="handle('createOrder')"
        >生成订单</el-button
      >
      <el-button class="btn-style" @click="handle('enquiry')"
        >再次询价</el-button
      >
    </div>
  </div>
</template>

<script>
import myDate from "@/components/Date/index";
export default {
  name: "ValidFilter",
  props: ["searchObj"],
  components: {
    myDate,
  },
  data() {
    return {
      options: [
        {
          value: "1",
          label: "实单报价",
        },
        {
          value: "2",
          label: "普通报价",
        },
        {
          value: "3",
          label: "BOM询价",
        },
      ],
      value: "",
      time: "",
    };
  },
  methods: {
    getCreateDate(date) {
      this.$nextTick(() => {
        this.searchObj.createDate = date;
      });
    },
    handle(func) {
      this.$emit("handle", func);
    },
  },
  created() {},
};
</script>
<style lang="scss" scoped>
.filter-card {
  margin-bottom: 20px;
  .up {
    display: flex;
    flex-direction: row;
    align-items: center;
    .search-item {
      display: flex;
      align-items: center;
      margin-right: 15px;
      .el-input {
        width: 200px;
      }
    }
  }
  .down {
    margin-top: 20px;
  }
  .btn-style {
    background-color: rgba(68, 42, 141, 1);
    color: #ffffff;
  }
}
</style>
